<template>
  <!-- 商品参数组件 -->
  <div class="params">
    <h2>商品参数</h2>
    <p v-for="item in attribute" :key="item.name">
      <span>{{ item.name }}</span>
      <big class="beyond_eip">{{ item.value }}</big>
    </p>
  </div>
</template>

<script>
export default {
  props: ['attribute']
}
</script>

<style lang='less' scoped>
.params {
  background-color: #fff;
  padding: 0.1rem;
  h2 {
    font-size: 0.25rem;
    line-height: 0.4rem;
  }
  p {
    background-color: #efefef;
    border-radius: 0.06rem;
    height: 0.3rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.05rem;
    span {
      width: 22%;
      color: #999;
      text-align: right;
      margin-right: 0.05rem;
    }
    big {
      flex: 1;
      font-size: .16rem;
      line-height: .16rem;
    }
  }
}
</style>
